<!--
    Desenvolvido pela Fábrica de Software do CESUPA.
    Todos os direitos reservados.

    @author Breno Leite
-->

<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:a4j="http://richfaces.org/a4j"
      xmlns:rich="http://richfaces.org/rich"
      xmlns:c="http://java.sun.com/jstl/core"
      xmlns:appcommons="http://www.fabsoft.cesupa.br/appcommons">

    <ui:composition template="/infrastructure/templates/two-columns-internal-template.xhtml">
        <ui:param name="pagetitle" value="Exemplo de formulário"/>
        <ui:param name="showpagecontrols" value="true"/>
        <ui:param name="pageicon" value="#{facesContext.externalContext.request.contextPath}/infrastructure/images/icons/add-16x16.gif"/>

        <ui:define name="currentstatusmessages">
            <appcommons:currentStatus statusid="saving-data-status"
                                      message="Gravando dados..."/>
        </ui:define>

        <ui:define name="controls">
            <rich:toolBar height="34" itemSeparator="line">
                <rich:toolBarGroup styleClass="rich-toolbar-group">
                    <h:graphicImage url="/infrastructure/images/icons/save-16x16.gif"/>
                    <a4j:commandLink value="Gravar" status="saving-data-status" action="SYSTEM.goToLogin"/>
                </rich:toolBarGroup>
                <rich:dropDownMenu itemClass="rich-item" id="file-menu" styleClass="rich-dropdownmenu">
                    <f:facet name="label">
                        <h:panelGroup>
                            <h:outputText value="Selecionar..."/>
                            <rich:spacer width="3px"/>
                            <h:graphicImage url="/infrastructure/images/icons/details-16x16.gif" width="10" height="10"/>
                        </h:panelGroup>
                    </f:facet>
                    <rich:menuItem value="Opção 1" icon="/infrastructure/images/icons/add-16x16.gif">
                    </rich:menuItem>
                    <rich:menuItem value="Opção 2">
                    </rich:menuItem>
                </rich:dropDownMenu>
                <rich:toolBarGroup styleClass="rich-toolbar-group">
                    <h:graphicImage url="/infrastructure/images/icons/cancel-16x16.gif"/>
                    <h:commandLink value="Cancelar operação" immediate="true" action="SYSTEM.goToLogin"/>
                </rich:toolBarGroup>
            </rich:toolBar>
        </ui:define>


        <ui:define name="content">
            <fieldset class="custom-fieldset">
                <legend class="custom-legend">Dados Pessoais</legend>
                <table class="custom-table" border="0" cellpadding="10">
                    <tr>
                        <td valign="top" style="width:100px;">
                            <label for="example-form:name-field">Nome:</label><br/>
                            <span style="color:red;font-size:x-small;">Obrigatório</span>
                        </td>
                        <td valign="top" style="width:250px;">
                            <h:inputText styleClass="text-field keyboardInput" id="name-field"/>
                        </td>
                        <td valign="top" class="info-cell">
                            De 3 a 10 caracteres.
                        </td>
                    </tr>
                    <tr style="border-bottom:dotted 1px black;">
                        <td valign="top">
                            <label for="example-form:last-name">Sobrenome:</label><br/>
                            <span style="color:red;font-size:x-small;">Obrigatório</span>
                        </td>
                        <td valign="top">
                            <h:inputText id="last-name" styleClass="text-field keyboardInput">

                            </h:inputText>
                        </td>
                        <td valign="top" class="info-cell">
                            De 3 a 10 caracteres.
                        </td>
                    </tr>
                    <tr >
                        <td valign="top">
                            <label for="example-form:email-field">E-Mail:</label><br/>
                            <span style="color:red;font-size:x-small;">Obrigatório</span>
                        </td>
                        <td valign="top">
                            <h:inputText id="email-field" styleClass="text-field keyboardInput">

                            </h:inputText>
                        </td>
                        <td valign="top" class="info-cell">
                            Exemplo: usuario@servidor.com
                        </td>
                    </tr>
                </table>
            </fieldset>
                        
        </ui:define>
    </ui:composition>
</html>